<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
	<meta name="apple-mobile-web-app-capable" content="no" />
	<title>统采商城</title>
	<link rel="stylesheet" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/css/mui.min.css">
	<link rel="stylesheet" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/sui/css/SUI.css">
    <link rel="stylesheet" type="text/css" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/font/iconfont.css">
	<link rel="stylesheet" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/swiper/css/swiper.min.css">
	<link rel="stylesheet" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/tcindex.css">
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/dropload.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/css/mui.picker.css">
	<link rel="stylesheet" type="text/css" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/css/mui.poppicker.css">
</head>
<style type="text/css">
	.scroll-bar{width: 50px;height: 3px;background: #ddd;margin-top: 10px;position: relative;left: calc(50% - 25px);bottom: 40px;border-radius: 1.5px}
	.scroll-bar .bar{width: 20px;height: 3px;border-radius: 1.5px;background: #FE6E27;position: absolute}

	.mui-bar-tab .mui-tab-item .mui-icon{top: 5px;}
	.tran-new{text-align: center;padding: 5px 10px}
	.tran-new .title{font-size: 20px;font-weight: 600}
	.tran-new .en-title{position: relative}
	.tran-new .en-title span{font-size: 12px;font-weight: 600;background: #efeff4;padding: 0 5px}
	.tran-new .en-title:after{width: 100%; position: absolute; top: 50%; left: 0; height: 1px; background-color: #ccc; content: "";z-index: -1}
	.groupPurchase {background-color: #fff;padding: 0;margin: 0}
	.groupPurchase .brand-box{padding: 5px 0;border-bottom: 1px solid #f4f3f6;height: 32px;overflow: hidden;}
	.groupPurchase .brand-box .brand{display: flex;align-items: center;overflow-x: scroll;overflow-y: hidden;padding-bottom: 15px}
	.groupPurchase .brand-box .brand::-webkit-scrollbar {display: none}
	.groupPurchase .brand span{font-weight: 500;color: #666;display: inline-block;padding: 0 10px;flex-shrink: 0}
	.groupPurchase .brand .on{color: #FD7722;font-size: 16px}
	.groupPurchase div.gpPrd{padding: 0;margin: 0;border: none;box-shadow: none;overflow: hidden;}
	.groupPurchase div.gpPrd::-webkit-scrollbar {display: none}
	.groupPurchase div.gpPrd ul{display: flex;padding-bottom: 5px}
	.groupPurchase div.gpPrd ul li{width: 35vw !important;flex-shrink: 0;padding: 10px}
	.groupPurchase div.gpPrd ul li i{color:#e54242;position:absolute;bottom: 10px;right:15%;font-size: 16pt}
	/*.rcmdPrdList dl{position: relative;}
	.rcmdPrdList dl i.iconfont{color:#e54242;position:absolute;bottom: 10px;right:5px;font-size: 18pt}
	.rcmdPrdList dl .x{position: absolute;top: 2.5px;right:2.5px;z-index: 9;width: 30px;height: 30px;}*/
	.groupPurchase div.gpPrd ul li a{padding: 0}
/*	.searchcenter{padding: 15px;background: #fff;height: 70px}
	.searchcenter input[type=text]{margin: 0;width: calc(100% - 40px);float: left;}
	.searchcenter input[type=submit]{margin: 0;width: 40px;float: left;height: 40px;float: left;background-color: #fff;border-radius: 0;border: 0;color:#333;}*/
	.gpPrd li{position: relative;}
	.gpPrd li .x{position: absolute;top: 0px;right:5px;z-index: 9;width: 30px;height: 30px;}
	.column dl{width: calc(50vw - 30px) !important;height: calc(50vw - 30px) !important;margin-left: 20px;margin-top: 20px;}
	.column dl dt{border-radius: 10px;}
	.column{height: 100vw !important;}
	/*.topLine a{position: absolute;left: 0;top: 0;bottom: 0;width: 100px;}*/
	.promotion-container {margin: 10px 0;padding: 10px;background-color: #fff;}
	.promotion-container .img {overflow:hidden;width: 100%;max-height: 45vw;border-radius: 3px;box-shadow: 0 0 1px #e54242;}
	.promotion-container .img img {width: 100%;}
	.promotion-container .content {display: flex; justify-content: space-between;margin-top: 7px;padding: 0 3px;}
	.promotion-container .describe h3 {color: #333;font-size: 16px;}
	.promotion-container .describe p {color: #ccc;margin-bottom: 0;}
	.promotion-container .btn {flex: 0 0 50px;align-self: flex-end;width: 50px;height:25px;margin-left: 10px;line-height:25px;color: #e54242;border-radius: 3px;text-align: center;box-shadow: 0 0 3px #e54242;font-weight:500;}
	
	.location-wrap {display: flex;justify-content: space-between;align-items: center;height: 40px;padding: 0 10px;line-height: 40px;width: 100%;background-color: #fff;margin: 0 0 10px;box-sizing: border-box;}
	/*.location-wrap .currentLocation {height: 100%;margin: 0;margin-left: 10px; color: #999;}*/
	.location-wrap .selectArea {position: relative;color: #333;font-weight: 600;font-size: 16px;}
	.location-wrap .relocation {color: #999;}
	.location-wrap .relocation span {margin-left: 3px;color: #e54242;text-decoration: underline;}
	.searchcenter {display: flex;align-items: center;background:linear-gradient(to right, #FF8F07, #FD5305);padding: 0 10px;height: 55px}
/*	.searchcenter .eq-wrap {display: flex;flex-direction: column;justify-content: center;align-items: center;width: 60px;height: 40px;color: #fff;font-size: 0;}*/
	.searchcenter .eq-wrap img {width: 30px;}
	.searchcenter .eq-wrap div {font-size: 10px;color: #fff;text-align: center;line-height: 0}
	.searchcenter form{flex: 1 0;margin: 0 15px}
	.searchcenter input.index-search {height: 35px;border-radius: 18px;background-color: #fff;margin-bottom: 0}
	.searchcenter .area-select {position: relative;color: #fff;font-size: 16px;padding-right: 15px;font-weight: 600}
	.searchcenter .area-select::after {content: '';position: absolute;top: -3px;bottom: 0;right: 2px;margin: auto;width: 6px;height: 6px;border-top: 2px solid #fff;border-left: 2px solid #fff;transform: rotate(-135deg)}
	/*.searchcenter input[type=submit] {background-color: transparent;color: #fff !important;}*/
	.nav-tag{background: linear-gradient(to right, #FF8F07, #FD5305);color: #fff;display: flex;height: 26px}
	.nav-tag .keyword-wrap {display: flex;align-items: center;width: 100%;font-size: 12px;padding: 0 0 15px 0;overflow-x: scroll;width: calc(100% - 70px);overflow-y: hidden;-webkit-overflow-scrolling: touch;height: 36px}
	.nav-tag .keyword-wrap::-webkit-scrollbar {display: none}
	.nav-tag .keyword-wrap .tag {padding: 0 10px;flex-shrink: 0;display: inline-block;}
	.nav-tag .keyword-wrap .tag:first-of-type{font-size: 16px;font-weight: 900;position: relative;}
	.nav-tag .keyword-wrap .tag:first-of-type::after{content: '';background: #fff;width: calc(100% - 20px);height: 2px;position: absolute;bottom: -2px;left: 10px}
	.nav-tag .classify{padding: 0 10px 0 5px;position: relative;}
	.nav-tag .classify::after{content: '';background: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,.05));width: 8px;height: 20px;position: absolute;left: -8px;top: 0}
	.nav-tag .classify div{width: 55px;text-align: center;background: rgba(255,255,255,.2);line-height: 20px;border-radius: 10px;font-weight: 500}
	.nav-tag .classify span{display: inline-block;width: 8px;height: 8px;border: #fff solid;border-width: 1.5px 0;position: relative;left: -3px}
	.nav-tag .classify span::after{content: '';background: #fff;width: 8px;height: 1.5px;position: absolute;left: 0;top: calc(50% - 0.75px)}
	.swiper-container{height: 33.3vw}
	.swiper-container .pie{height: 20px;border-radius: 50%;background: #fff;position: absolute;bottom: -13px;left: -10px;z-index: 1;width: calc(100% + 20px);}
	.p-area{background: #fff;padding-bottom: 10px;height: 159px;overflow: hidden;box-sizing: content-box}
	.p-area .box-fun{display: flex;overflow-x: scroll;padding-bottom: 40px}
	.p-area .box-fun .box-c{display: flex;flex-wrap: wrap;flex-shrink: 0;width: 100vw}
	.p-area .box-fun .box-c .fun{text-align: center;width: 20%;flex-shrink: 0;padding-top: 10px}
	.p-area .box-fun .box-c .fun img{width: 45px;height: 45px;margin: 0 10px}
	.p-area .box-fun .box-c .fun span{margin-top: 5px;font-size: 12px;color: #515151}

	.nav-fun{margin: 10px;border-radius: 10px;display: flex;flex-wrap: wrap;background: #fff}
	.nav-fun .nav-box{width: 50%;flex-shrink: 0;padding: 10px;position: relative}
	.nav-fun .nav-box:nth-of-type(2n-1)::after{content: '';width: 1px;height: 100%;background: #f4f3f6;position: absolute;right: 0;top: 0}
	.nav-fun .nav-box .icon-31fanhui2{font-size: 10px;margin-left: 3px}
	.nav-fun .nav-box .title{font-size: 16px;display: flex;align-items: center;font-weight: 600;position: relative}
	.nav-fun .nav-box .title span{font-size: 12px;padding: 0 3px;background: #F41D47;color: #fff;border-radius: 5px;margin-left: 5px}
	.nav-fun .nav-box:nth-of-type(3) .title span{padding: 1px 3px;background: #FD7722;position: relative;left: 5px;top: -5px}
	.nav-fun .nav-box:nth-of-type(3) .title span::after{content: '';border-color: transparent transparent transparent #FD7722;border-width: 10px 8px;border-style: solid;transform: rotate(40deg);position: absolute;left: 0;bottom: -10px}
	.nav-fun .nav-box .swiper-container{height: 100%;margin-bottom: 5px}
	.nav-fun .nav-box:nth-of-type(1),.nav-fun .nav-box:nth-of-type(2){margin-bottom: 5px}
	.swiper-slide{display: flex;flex-wrap: wrap;align-content: flex-start}
	.nav-fun .nav-box .nav-box-c{margin-top: 5px;width: 50%;text-align: center}
	.nav-fun .nav-box .nav-box-c .subtitle{font-weight: 500;color: #666}
	.nav-fun .nav-box .nav-box-c img{display: block;width: 100%}
	.nav-fun .new-box{font-size: 0}
	.nav-fun .new-box .subtitle{background: url(https://test.tongcaigou.com/static/img/bb1.jpg);text-align: center;margin: 5px 0;color: #fff}
	.nav-fun .new-box span{font-size: 10px;color: #333;width: 50%;display: inline-block;line-height: 16px}
	.nav-fun .nav-box .img-box{font-size: 0}
	.nav-fun .nav-box .img-box .news{width: 50%;display: inline-block;}

	.activity{padding: 10px 0;background: #fff;height: calc(30vw + 72px);overflow: hidden;}
	.activity .ac_box{display: flex;align-items: center;padding-left: 10px;overflow-x: scroll;padding-bottom: 40px}
	.activity .column-container{flex-shrink: 0;padding-right: 15px}
	.activity .column-container:last-of-type{padding-right: 10px}
	.activity .column-container h3{display: block;padding: 5px;background: linear-gradient(to right,#FF6275,#FF3B4B);border-radius: 3px;font-size: 16px;color: #fff;font-weight: 600}
	.activity .column-container .activetime {display: block;margin: 5px 0;font-size: 12px;font-weight: 500;color: #666}
	.activity .column-container img {width: calc(50vw - 17.5px);display: block;height: calc(30vw - 10.5px);}
	/*.menu {display: flex;justify-content: space-around;height: auto;padding: 10px 0px 10px;}
	.menu .menu-cell {display: flex;flex: 1 0;justify-content: center;flex-direction: column;white-space: nowrap;max-width: 28%;}
	.menu-cell .img-wrap {width: 100%;font-size: 0;line-height: 0;}
	.menu-cell .img-wrap img {width: 100%;}*/
	.classify{padding: 10px 0 8px 0;display: flex;align-items: center;}
	.classify .case{width: 25%;text-align: center;}
	.classify .case .t1{font-size: 16px;font-weight: 600}
	.classify .case .t2{font-size: 12px;line-height: 18px;color: #666}
	.classify .on .t1{color: #e46c22}
	.classify .on .t2{padding: 0 10px;background: #FD7722;border-radius: 10px;color: #fff;display: inline-block;}

	.screen-cover {position: fixed;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(0,0,0,0.7);z-index: 11;overscroll-behavior: contain;display: none;}
	.pors-wrap {position: relative;top: 50%;width: 80%;margin: 0 auto;padding: 1px 8px 8px;transform: translateY(-50%);background-color: #fff;box-sizing: border-box;background-color: #e54242;}
	.pro-cell {position: relative;font-size: 0;padding: 5px;margin: 8px 0;background-color: #fff;box-shadow: 0 0 3px rgba(0,0,0,0.18);border-radius: 3px;box-sizing: border-box;border: solid 1px #e54242;}
	.pro-cell .img-wrap {display: inline-block;position: relative;width: 25%;padding-top: 25%;overflow: hidden;background-color: #fff;vertical-align: middle;}
	.pro-cell .img-wrap img {position: absolute;width: 100%;top: 50%;transform: translateY(-50%);}
	.pro-cell .info {display: inline-block;width: 50%;box-sizing: border-box;padding: 0 5px 0 18px;font-size: 0;vertical-align: middle;}
	.pro-cell .title {display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 2;font-size: 14px;font-weight: 400;color: #333;line-height: 18px;height: 36px;}
	.pro-cell .price {margin-top: 3px;color: #e31939;}
	.pro-cell .buy {display: inline-block;width: 25%;overflow: hidden;vertical-align: middle;text-align: center;height: 24px;line-height: 24px;border-radius: 20px;background-color: #e54242;color: #fff;font-size: 12px;}
	.pro-cell:before, .pro-cell:after {position: absolute;content: '';display: block;width: 10px;height: 10px;border-radius: 5px;background-color: #e54242;left: calc(25% + 5px);top: -7px;}
	.pro-cell:after {top: auto;bottom: -7px;}
	.pors-wrap .close {position: absolute;left: 0;right: 0;margin: auto;bottom: -50px;width: 30px;height: 30px;border-radius: 25px;border: solid 1px #fff;vertical-align: center;text-align: center;color: #fff;}
	.pors-wrap .close:after, .pors-wrap .close:before {position: absolute;content: '';display: block;height: 15px;width: 1px;background-color: currentColor;left: 0;right: 0;margin: auto;top: 0;bottom: 0;transform: rotate(45deg);}
	.pors-wrap .close:before {transform: rotate(-45deg);}
	.screen-cover .top {position: absolute;background-color: #fff;top: -70px;left: 0;width: 40px;height: 40px;line-height: 50px;border-radius: 25px;}
	.screen-cover .top img {width: 100%;}
	.screen-cover .top img {position: absolute;left: 0;}
	.screen-cover .name {position: absolute;height: 35px;line-height: 35px;width: 55%;background-color: #e54242;left: 0;right: 0;margin: auto;top: -50px;color: #fff;font-weight: bold;font-size: 16px;border-radius: 20px;text-align: center;}
	.screen-cover .name:after, .screen-cover .name:before {content: '';display: block;position: absolute;height: 20px;border-left: dashed 1px #e54242;bottom: -19px;left: 18%;}
	.screen-cover .name:after {left: auto;right: 18%;}
</style>
<body>
	<div class="screen-cover">
		<div class="pors-wrap">
			<!-- <div class="top">
				<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/logo.png">
			</div> -->
			<div class="name goto" href="/mobile/index/recom">人气推荐</div>
			{{ range $i,$v := .popup}}
			<div class="pro-cell">
				<div class="img-wrap goto" href="/mobile/column/product_content?id={{.id}}">
					<img src="{{.pathname}}">
				</div>
				<div class="info">
					<div class="title goto" href="/mobile/column/product_content?id={{.id}}">{{.title}}</div>
					<div class="price">&yen;{{if .vprice}}{{.vprice}}{{else}}{{.price}}{{end}}</div>
				</div>
				<div class="buy goto" href="/mobile/column/product_content?id={{.id}}">查看详情</div>
			</div>
			{{end}}
			<div class="close icon close-up"></div>
		</div>
	</div>
	<div class="searchcenter">
		<div class="area-select goto" href="/mobile/index/area">
			{{.cityshop.currentcity.area}}
		</div>
		<form action="/mobile/column/search_result" method="get">
			<input type="text" name="keywords" class="index-search" placeholder="请输入搜索关键词">
			<!-- <input style="color:#e54242" type="submit" value="搜索"> -->
		</form>
		<div class="eq-wrap qrscan">
			<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/eqCode.png">
			<div>扫一扫</div>
		</div>
	</div>
	<div class="nav-tag">
		<div class="keyword-wrap">
			<div class="tag">首页</div>
			{{if .keywords}}
			{{range .keywords}}
			<div class="tag goto" href="/mobile/column/search_result?keywords={{.title}}">{{.title}}</div>
			<div class="tag goto" href="/mobile/column/search_result?keywords={{.title}}">{{.title}}</div>
			{{end}}
			{{end}}
			
		</div>
		<div class='classify'><div><span></span>分类</div></div>
	</div>
	<div class="swiper-container swiper1">
		<div class="swiper-wrapper" id="slide">
			{{range .ad}}
			<div class="swiper-slide goto" href="{{.url}}" style="background-image: url({{.pathname}});"></div>
			{{end}}
		</div>
		<div class="swiper-pagination"></div>
		<div class='pie'></div>
	</div>
	<div class='p-area'>
	    <div class='box-fun'>
	        <div class='box-c'>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	        </div>
	        <div class='box-c'>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	          <div class='fun'>
	            <img src='/static/wechat/img/logo.png' mode="aspectFill" />
	            <div>山东产区</div>
	          </div>
	        </div>
	    </div>
	    <div class='scroll-bar'>
	      <div class='bar' id='bar_1'></div>
	    </div>
    </div>
    <div class='nav-fun'>
	    <div class='nav-box'>
	      <div class='title'>品牌街<span>实力厂家<i class="iconfont icon-31fanhui2"></i></span></div>
	      <div class="swiper-container swiper2">
	      	<div class="swiper-wrapper">
	        <div class="swiper-slide">
	          <div class='nav-box-c'>
	            <div class='subtitle'>明星工厂</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>核心工厂</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>合作工厂</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>辅助工厂</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	        </div>
	        <div class="swiper-slide">
	          <div class='nav-box-c'>
	            <div class='subtitle'>明星工厂</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>核心工厂</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>合作工厂</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>辅助工厂</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	        </div>
	        </div>
	        <div class="swiper-pagination"></div>
	      </div>
	    </div>
	    <div class='nav-box'>
	      <div class='title'>商品结构<span>MORE<i class="iconfont icon-31fanhui2"></i></span></div>
	      <div class="swiper-container swiper2">
	      	<div class="swiper-wrapper">
	        <div class="swiper-slide">
	          <div class='nav-box-c'>
	            <div class='subtitle'>网红商店</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>大卖场</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>社区店</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>综合市场</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	        </div>
	        <div class="swiper-slide">
	          <div class='nav-box-c'>
	            <div class='subtitle'>网红商店</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>大卖场</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>社区店</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	          <div class='nav-box-c'>
	            <div class='subtitle'>综合市场</div>
	            <img src='/static/wechat/img/logo.png' />
	            <img src='/static/wechat/img/logo.png' />
	          </div>
	        </div>
	    	</div>
	    	<div class="swiper-pagination"></div>
	      </div>
	    </div>
	    <div class='nav-box'>
	      <div class='title'>新手加入<span>了解统采</span></div>
	      <div class='new-box'>
	        <div class='subtitle'>采购流程</div>
	        <span>统采购物流程</span>
	      </div>
	      <div class='new-box'>
	        <div class='subtitle'>统采介绍</div>
	        <span>统采介绍</span>
	        <span>统采发展进程</span>
	      </div>
	      <div class='new-box'>
	        <div class='subtitle'>统采模式</div>
	        <span>统采线上资源优势</span>
	        <span>专业服务团队优势</span>
	        <span>统采订购软件优势</span>
	      </div>
	      <div class='new-box'>
	        <div class='subtitle'>功能介绍</div>
	        <span>功能介绍</span>
	      </div>
	      <div class='new-box'>
	        <div class='subtitle'>合伙人</div>
	        <span>城市合伙人</span>
	        <span>区域合伙人</span>
	      </div>
	    </div>
	    <div class='nav-box'>
	      <div class='title'>统采头条</div>
	      <div class="img-box">
	      	<img class="news" src='/static/wechat/img/logo.png' />
	      	<img class="news" src='/static/wechat/img/logo.png' />
	      	<img class="news" src='/static/wechat/img/logo.png' />
	      	<img class="news" src='/static/wechat/img/logo.png' />
	      </div>
	    </div>
	 </div>
	</div>
	<!-- <div class="location-wrap">
		<div class="selectArea">
			当前: {{.cityshop.currentcity.area}}
		</div>
		{{if .currentcity}}
		{{else}}
		<div class="relocation">定位失败请<span id="relocation">重新定位</span></div>
		{{end}}
	</div> -->
	<!-- <div class="menu">
		<div class="menu-cell goto" href="/mobile/index/brandStreet">
			<div class="img-wrap">
				<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/index_menu/brand-street.jpg">
			</div>
		</div>
		<div class="menu-cell goto" href="/mobile/product/struct">
			<div class="img-wrap">
				<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/index_menu/product-struct.jpg">
			</div>
		</div>
		<div class="menu-cell goto" href="/mobile/index/novicejoin">
			<div class="img-wrap">
				<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/index_menu/novice-join.jpg">
			</div>
		</div>
		<dl class="menu_item goto" href="/mobile/active">
			<dt><img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/index_menu/hd.png" alt=""></dt>
			<dd>活动</dd>
		</dl>
		<dl class="menu_item qrscan">
			<dt><img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/index_menu/tg.png" alt=""></dt>
			<dd>扫一扫</dd>
		</dl>
		<dl class="menu_item goto" href="/mobile/index/brandStreet">
			<dt><img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/index_menu/pp.png" alt=""></dt>
			<dd>品牌街</dd>
		</dl> -->
		<!-- <dl class="menu_item goto"  href="/mobile/column/search_result?status=3">
			<dt><img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/index_menu/xp.png" alt=""></dt>
			<dd>新品</dd>
		</dl>
		<dl class="menu_item goto" href="/mobile/column">
			<dt><img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/index_menu/fl.png" alt=""></dt>
			<dd>分类</dd>
		</dl>
	</div> -->
	<!-- <div class="topLine swiper-no-swiping">
		<a class="goto" href="/mobile/index/news_list"></a>
		<div class="swiper-wrapper" id="slide">
			{{range .news}}
			<div class="swiper-slide goto" href="/mobile/index/news_content?id={{.id}}">{{.title}}</div>
			{{end}}
		</div>
	</div>
 -->
	<!-- {{ if .sysRcmd }}
	<div class="sysRcmd">
		{{ if .recom }}
		<dl class="goto" href="/mobile/index/recom">
			<dt>
				<p>精品推荐</p>
				<p>为您推荐优质产品</p>
			</dt>
			<dd><img src="{{.recom.pathname}}" alt=""></dd>
		</dl>
		{{ end }}
		{{ if .good }}
		<dl class="goto" href="/mobile/index/good">
			<dt>
				<p>有好货</p>
				<p>总有你想要的产品</p>
			</dt>
			<dd>{{range .good}}<img src="{{.pathname}}" alt="">{{end}}</dd>
		</dl>
		{{ end }}
		{{ if .mbuy }}
		<dl class="goto" href="/mobile/index/mbuy">
			<dt>
				<p>必买清单</p>
				<p>都是为你准备的</p>
			</dt>
			<dd>{{range .mbuy}}<img src="{{.pathname}}" alt="">{{end}}</dd>
		</dl>
		{{ end }}
		{{ if .column }}
		<div class="column">
			{{range $i, $v := .column}}
			{{ if $v }}
			<dl class="goto" href="/mobile/index/program?id={{.id}}">
				<dt class="suiBgImg" style="background-image: url({{if .pathname}}{{.pathname}}{{else}}/static/wechat/img/logo.png{{end}});"></dt>
				<dd>{{.name}}</dd>
			</dl>
			{{ end }}
			{{end}}
		</div>
		{{ end }}
	</div>
	{{ end }} -->
	<div class="activity">
		<div class='ac_box'>
			{{ if .column }}
			{{range $i, $v := .column}}
			{{ if $v }}
			<div class="column-container goto" href="/mobile/index/program?id={{.id}}">
				<h3 {{if .bgImgpathname}}style="background: url({{.bgImgpathname}}) no-repeat;background-size: 100% 100%;"{{end}}>{{.name}}</h3>
				<div class="activetime">活动时间: {{.activetime}}</div>
				<div class="img">
					<img src="{{.pathname}}">	
				</div>
			</div>
			{{ end }}
			{{end}}
			{{ end }}
		</div>
		<div class='scroll-bar'>
	      <div class='bar' id='bar_2'></div>
	    </div>
	</div>

	{{ if .block }}
	{{ range $i,$v := .block }}
	{{ if $v }}
	<div class="promotion-container">
		<div class="img goto" href="{{.url}}">
			<img src="{{.pathname}}">
		</div>
		<div class="content">
			<div class="describe">
				<h3>{{.name}}</h3>
				<p>{{.intr}}</p>
			</div>
			<div class="btn goto" href="{{.url}}">更多</div>
		</div>
	</div>
	{{ end }}
	{{ end }}
	{{ end }}
	<div class="tran-new">
      <div class="title">产品新区</div>
      <div class='en-title'><span>NEW PRODUCTS</span></div>
    </div>
	<div class="groupPurchase">
		<div style="display: none"></div>
		<ul class='brand-box'>
	        <li class='brand'>
	          <span class="on">好厨夫</span>
	          <span>好厨夫</span>
	          <span>好厨夫</span>
	          <span>好厨夫</span>
	          <span>好厨夫</span>
	          <span>好厨夫</span>
	          <span>好厨夫</span>
	          <span>好厨夫</span>
	        </li>
	    </ul>
		<div class="gpPrd">
			<ul>
				{{range .recommend}}
				<li>
					<a class="goto" href="/mobile/column/product_content?id={{.id}}">
						<p><img src="{{.pathname}}" alt=""></p>
						<p>{{.title}}</p>
						<p>
							{{if .vprice}}
							<span>&yen; {{.vprice}}</span><s>&yen; {{.price}}</s>
							{{else}}
							<span>&yen; {{.price}}</span>
							{{end}}
						</p>
					</a>
					<i class="iconfont scadd" data-id="{{.id}}" >&#xe619;</i>
					{{if eq .active 1}}
					<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/gbuy.png" class="x">
					{{else if eq .active 2}}
					<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/sales.png" class="x">
					{{end}}
				</li>
				{{end}}
			</ul>
		</div>
	</div>

	<div class='classify'>
	    <div class='case on'>
	      <div class='t1'>全部</div>
	      <div class='t2'>精品推荐</div>
	    </div>
	    <div class='case'>
	      <div class='t1'>热销品</div>
	      <div class='t2'>好货热卖</div>
	    </div>
	    <div class='case'>
	      <div class='t1'>新品推荐</div>
	      <div class='t2'>新品抢先购</div>
	    </div>
	    <div class='case'>
	      <div class='t1'>网红新品</div>
	      <div class='t2'>热销爆款</div>
	    </div>
	  </div>
	<div class="rcmdPrdList">
		{{range .product}}
		<dl class="goto">
			<dt  class="goto" href="/mobile/column/product_content?id={{.id}}">
				<img class="lazy-load" data-src="{{.pathname}}" alt="">
			</dt>
			<dd>
				<p>{{.title}}</p>
				<p>{{if .vprice}}
							<span>&yen; {{.vprice}}</span><s>&yen; {{.price}}</s>
							{{else}}
							<span>&yen; {{.price}}</span>
							{{end}}</p>
				<p>好评率{{.hp}}%</p>
			</dd>
			<i class="iconfont scadd" data-id="{{.id}}" >&#xe619;</i>
			{{if eq .active 1}}
			<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/gbuy.png" class="x">
			{{else if eq .active 2}}
			<img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/sales.png" class="x">
			{{end}}
		</dl>
		{{end}}
	</div>
<nav class="mui-bar mui-bar-tab">
    <a class="mui-tab-item mui-active goto" href="/mobile/index">
        <span class="mui-icon iconfont icon-home2"></span>
        <span class="mui-tab-label">首页</span>
    </a>
    <a class="mui-tab-item goto" href="/mobile/column">
        <span class="mui-icon iconfont icon-liebiao"></span>
        <span class="mui-tab-label">分类</span>
    </a>
    <a class="mui-tab-item" href="/mobile/active">
        <span class="mui-icon iconfont icon-tianmaohaoquan"></span>
        <span class="mui-tab-label">活动</span>
    </a>
    <a class="mui-tab-item goto" href="/mobile/shopcar">
        <span class="mui-icon iconfont icon-gouwucheman"></span>
        <span class="mui-tab-label">购物车</span>
    </a>
    <a class="mui-tab-item goto" href="/mobile/my">
		<span class="mui-icon iconfont icon-kefuyouxian"></span>
		<span class="mui-tab-label">我的</span>
	</a>
</nav>
</body>
<script src="https://api.map.baidu.com/api?v=3.0&ak=pZNN8yCbWXBezCgGpnKMQi283dFLAVGO&s=1" type="text/javascript"></script>
<script type="text/javascript" src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/sui/js/SUI.js?"></script>
<script type="text/javascript" src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/js/mui.min.js"></script>
{{template "wechat/public/share.html" .}}
<!-- <script type="text/javascript" src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/js/mui.picker.min.js"></script>
<script type="text/javascript" src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/js/mui.poppicker.js"></script> -->
<script type="text/javascript" src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/swiper/js/swiper.min.js"></script>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/js/wechat/lazy-load.js"></script>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/js/zepto.min.js"></script>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/js/dropload.min.js"></script>
<script type="text/javascript" charset="utf-8">
	lazyLoad()
	if (sessionStorage.getItem('isQR')) {
		wx.ready(function () {
			qrCode()
		})
	}
	sessionStorage.setItem('currentCity', {{.cityshop.currentcity.area}})
	{{if .currentcity}}
		// var nowTime = + new Date
		// var upwindowtime = localStorage.getItem("upwindowtime")
		// if (!upwindowtime || upwindowtime < nowTime) {
		// 	var upWindow = document.getElementsByClassName('screen-cover')[0]
		// 	upWindow.style.display = 'block'
		//     mui('body').on('tap', '.close-up', function(e) {
		//     	var now = new Date
		// 		var endTime = now.setDate(now.getDate() + 7)
		// 		localStorage.setItem("upwindowtime", endTime)
		//     	upWindow.style.display = 'none'
		//     })
		// }
	{{else}}
	// _location()
	{{end}}
	// var picker = new mui.PopPicker()
	// var citylist = {{.cityshop.citylist}}
	// for (var v of citylist) {
	// 	delete v.city
	// 	v.text = v.area
	// 	v.value = v.id
	// 	delete v.area
	// 	delete v.id
	// }
	// picker.setData(citylist);
	// $('.selectArea').click(function() {
	// 	picker.show(function (res) {
	// 		$.ajax({
	// 			url: location.origin + '/changeShop',
	// 			data: {
	// 				shopid: res[0].value
	// 			},
	// 			success: function (res) {
	// 				if (res.status == 1) {
	// 					location.reload()
	// 				}
	// 			},
	// 			error: function(xhr, type){
	//                 mui.toast("网络慢，请重试!");
	//             }
	// 		})
	// 	})
	// })
	if ($('#relocation').length) {
		$('#relocation').click(_location)
	}
	window.onload = function(){
		if ($('.column-container').length>2) {
			$('.activity').css('height','calc(30vw + 85px)')
		}
		if ($('.box-c').length>1) {
			$('.p-area').css('height','175px')
		}
		$('.gpPrd').css('height',$('.gpPrd').height()-5+'px')
	}
	$(".ac_box").scroll(function () {
        var scrollLeft = $(this).scrollLeft();
        var bar = $('#bar_2')
        bar.css('left',scrollLeft/($('.column-container').width()*$('.column-container').length - $(window).width())*30+'px')
    });
    $(".box-fun").scroll(function () {
        var scrollLeft = $(this).scrollLeft();
        var bar = $('#bar_1')
        bar.css('left',scrollLeft/($('.box-c').width()*$('.box-c').length - $(window).width())*30+'px')
    });

	function _location() {
		var city = '' 
	    var geolocation = new BMap.Geolocation()
	    geolocation.enableSDKLocation(); 
	    geolocation.getCurrentPosition(function(r){  
	        if(this.getStatus() == BMAP_STATUS_SUCCESS){  
	            var pt = new BMap.Point(r.point.lng,r.point.lat)  
	            var geoc = new BMap.Geocoder()
	            geoc.getLocation(pt, function(rs){
	                var addComp = rs.addressComponents
	                city = addComp.city
	                relocation(city)
	            });      
	        } else {
	          var myCity = new BMap.LocalCity()
	          myCity.get(Ipmap)        
	        }          
	    },{enableHighAccuracy: true})
	    function Ipmap(res) {
	      city = res.name
	      relocation(city)
	    }
	}
	$('input[name="keywords"]').change(function(){
		$('form').submit()
	})
	function isWeiXin() {
		var ua = window.navigator.userAgent.toLowerCase();
		if (ua.match(/MicroMessenger/i) == 'micromessenger') {
			return true;
		} else {
			return false;
		}
	}
	function qrCode(){
		sessionStorage.removeItem('isQR')
		if(isWeiXin()){
			// mui.toast('扫一扫')
			wx.scanQRCode({
				needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
				scanType: ["barCode"], // 可以指定扫二维码还是一维码，默认二者都有
				success: function (res) {
					var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
					mui.toast('条形码:'+result.split(",")[1])	
					$.ajax({
						url:'/mobile/product_barcode',
						data:{barcode:result.split(",")[1]},
						success:function(res){
							if(res==0){
								mui.alert("本商城暂无此商品~")
							}else{
								sessionStorage.setItem('isQR', 1)
								window.location.href="/mobile/column/product_content?id="+res
							}
						}
					})
				},
				fail: function () {
					mui.toast('扫一扫出错')
				}
			});
		}else{
			mui.alert("手机版网页暂无此功能,请移步到微信公众号,小程序或者APP~","提示")
		}
	}
	$('.qrscan').click(qrCode)
    mui('.mui-tab-item').each(function () {
        this.addEventListener('tap',function () {
            var url = this.getAttribute('href');
            window.location.href=url;
        })
    });
    mui('body').on('tap','.goto',function(e){
    	stopPropagation(e)
    	var h=this.getAttribute("href")
    	if(h){
    		 window.location.href=h;
    	}
    })
	var swiper1 = new Swiper('.swiper1', {
		pagination: '.swiper-pagination',
		paginationClickable: true,
		loop:true,
		autoplay:3500
	});
	var swiper2 = new Swiper('.swiper2', {
		pagination: '.swiper-pagination',
	});
	/*var mySwiper = new Swiper('.topLine', {
		loop:true,
		autoplay:2000,
		paginationClickable: false,
		direction:'vertical'
	});*/
	// window.onscroll = function() {
	// 	if (this.scrollY < 40) {
	// 		document.querySelector(".search").style.backgroundColor = 'rgba(255,255,255,'+this.scrollY / 40+')'
	// 		document.querySelector(".search").style.borderBottom = 'none'
	// 	}else{
	// 		document.querySelector(".search").style.backgroundColor = 'rgba(255,255,255,1)'
	// 		document.querySelector(".search").style.borderBottom = '1px solid #eee'

	// 	}
	// }
</script>
<script>
	var page=3;
	var url = 'https://tcsc.oss-cn-hangzhou.aliyuncs.com'
	$('.element').dropload({
    scrollArea : window,
    threshold: 2,
    loadDownFn : function(me){
        $.ajax({
            type: 'GET',
            url: window.location.href,
            dataType: 'json',
            data:{page:page},
            success: function(data){
   			   var res=data.product
               page+=1
              if(res){
                 for (var i=0;i<res.length;i++){
                    var dl = document.createElement('dl');
                    dl.className="goto"	
 					var	html=`<dt class="goto" href="/mobile/column/product_content?id=`+res[i].id+`"><img class="lazy-load" data-src="`+res[i].pathname+`" alt=""></dt>
					<dd><p>`+res[i].title+`</p><p>`
					if(res[i].vprice){
						html+=`<span>&yen; `+res[i].vprice+`</span><s>&yen;`+res[i].price+`</s>`
					}else{
						html+=`<span>&yen; `+res[i].price+`</span>`
					}
					html+=`</p> <p>好评率`+res[i].hp+`%</p></dd><i class="iconfont scadd" data-id="`+res[i].id+`" >&#xe619;</i>`
					if (res[i].active==1){
						html+=`<img src="`+url+`/static/wechat/img/gbuy.png" class="x">`
					}else if(res[i].active==2){
						html+=`<img src="`+url+`/static/wechat/img/sales.png" class="x">`
					}
                    dl.innerHTML=html
                    document.getElementsByClassName('rcmdPrdList')[0].appendChild(dl)
                    // sort()
                }
                me.resetload();
                }else{
                    mui.toast("没有更多了！");
                    $(".dropload-down").remove();
                }
            },
            error: function(xhr, type){
                mui.toast("网络慢，请重新刷新!");
                me.resetload();
            }
        });
    }
});
function stopPropagation(e) {  
    if (e.stopPropagation) {  
        e.stopPropagation();  
    } else {  
        e.cancelBubble = true;  
    }  
}  
mui('body').on('tap','.scadd',function(e){
	stopPropagation(e)
	var pid=this.getAttribute("data-id")
	var data={num:1,pid:pid}
	mui.post('/mobile/shopcar',data,function(res){
		if(res==2||res==962){
			mui.confirm("您还未登入,请先登入","提示",function(res){
				if(res.index){
					mui.closePopups()
					window.location.href="/mobile/login"
				}
			})
		}else if(res==1){
			mui.toast("添加成功~")
		}else if(res==0){
			mui.toast("网络繁忙,请重试!")
		}else if(res==3){
          mui.toast('库存不足');
        }
	})
})
$('.expect').click(function () {
	mui.toast("敬请期待~")
})
</script>
</html>